<template>
    <p>{{ count }}</p>
    <button @click="add">添加</button>
    <button @click="say('传参的数据')">我要给方法传参</button>
    <ul>
        <li @click="clickItemHandle(item)" v-for="(item, index) in names">{{ item }}</li>
    </ul>

    <div>
        <input type="text" v-model.number="username" placeholder="请输入用户名">
        <input type="password" v-model.trim="password" placeholder="请输入密码">
        <p>{{ username }}{{ password }}</p>
        <button @click="getInputValue">获取2个输入框获取的值</button>
    </div>
</template>


<script>
export default {
    name: "Event",
    data() {
        return {
            count: 0,
            names: ["iwen", "ime", "frank"],
            username: "",
            password: ""
        }
    },
    methods: {
        add() {
            this.count++
        },
        say(data) {
            console.log("这是传过来的参数数据：" + data);
        },
        clickItemHandle(item) {
            console.log(item);
        },
        getInputValue() {
            console.log(this.username, this.password);
        }
    }
}

</script>